<template>
  <el-tooltip :content="$tr('Global Configurations')">
    <el-button @click="dialogVisible = true" disabled style="margin-left:0px">
      <el-icon><setting /></el-icon>
    </el-button>
  </el-tooltip>

  <el-dialog
    v-model="dialogVisible"
    title="Tips"
    width="30%"
    :before-close="handleClose"
  >
    <dynamic-form :data="data"></dynamic-form>
    <template #footer>
      <span>
        <el-button @click="dialogVisible = false">Cancel</el-button>
        <el-button type="primary" @click="dialogVisible = false"
          >Confirm</el-button
        >
      </span>
    </template>
  </el-dialog>
</template>

<script lang="ts">
import DynamicForm from "@/components/dynamicform/DynamicForm.vue";
import { reactive, ref, defineComponent } from "vue";
import { DATA_TYPE, FieldType } from "../dynamicform/formdatastruct";
import { Setting } from "@element-plus/icons-vue";
export default defineComponent({
  components: { DynamicForm, Setting },
  setup() {
    const dialogVisible = ref(false);
    const data = reactive<Record<string, FieldType>>({
      mainServerPort: {
        Type: DATA_TYPE.uint,
        Default: null,
        Required: true,
        Meta: null,
        Translation: "服务器端口号",
        Help: "本地服务器端口号默认为5000",
        Value: 5000,
      },
      graphDrawPort: {
        Type: DATA_TYPE.uint,
        Default: null,
        Required: true,
        Meta: null,
        Translation: "绘图端口号",
        Help: "Ligral在仿真过程中会通过UDP一并发出绘图信号。目前此功能无用",
        Value: 8784,
      },
      ligralExecutable: {
        Type: DATA_TYPE.string,
        Default: "ligral",
        Required: true,
        Meta: null,
        Translation: "Ligral引擎路径",
        Help: `Ligral程序所在的路径。如果Ligral已经添加到环境变量，则为"ligral". 否则请将可执行文件的绝对路径粘贴到此处。`,
        Value: "ligral",
      },
      // DataStorageLocation: {
      //   Type: DATA_TYPE.string,
      //   Default: null,
      //   Required: true,
      //   Meta: null,
      //   Translation: "数据存储位置",
      //   Help: `Ligral每次执行时都会将数据存储到某位置，从而便于查询执行记录。默认存放在“用户目录/Ligral下”。可以在此输入可执行文件的绝对路径，
      //   从而指定文件存储位置。`,
      //   Value: "",
      // },
    });
    return { dialogVisible, data };
  },
  methods: {
    handleClose() {
      this.dialogVisible = false;
    },
  },
});
</script>
